<template>
  <div class="good">
      <cartitem
        v-for="(item, index) in cartData" 
        :key="index"
        :item="item"
      ></cartitem>
      <div class="show" v-show="cartData == ''">
        <img src="../../assets/images/kong.png" alt="">
      </div>
      <re-goods></re-goods>
  </div>
</template>

<script>
import Cartitem from './Cartitem.vue';
// import regoods from '../ReGoods.vue'
import axios from 'axios';
import {mapState} from 'vuex';
import ReGoods from '../ReGoods.vue';
export default {
  components: { Cartitem, ReGoods },
  name:'CartList',
  data() {
    return {
      list:[]
    }
  },
  computed:{
    ...mapState(['cartData'])
  },
  mounted() {
    axios.get(`http://localhost:3000/xiaomi?type=手机`).then(
            response => {
                this.list = response.data.list
            },
            error =>{
                console.log('失败');
            }
        )
  },
}
</script>

<style scoped>
    .good{
        margin-top: 2rem;
        margin-bottom: 2rem;
    }
    .show {
      width: 100%;
      height: 6rem;
      background-color: #f7f5f5;
      text-align: center;
    }
    .show img {
      width: 6rem;
      height: 6rem;
    }
    .goods_list .cartgoods img {
      width: 100%;
    }

</style>